<template>
  <div>
    <el-table
      :data="data"
      border
      style="width: 100%"
    >
      <el-table-column
        prop="priceStrategyId"
        label="营销编码">
      </el-table-column>

      <el-table-column
        prop="name"
        label="活动主题"
      ></el-table-column>

      <el-table-column
        prop='tag'
        label="活动标签"
      ></el-table-column>

      <el-table-column label="生效时间" width='400'>
        <template scope="scope">
          <div v-if='scope.row.timeList.length > 0'>
            <p
              v-for='(item,$index) in scope.row.timeList'
            >{{$index+1}}.&nbsp;&nbsp;{{item['effectBeginTime'] | dateformat}} 至 {{item['effectEndTime'] | dateformat}}</p>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="优惠类型">
        <template scope='scope'>
          {{scope.row.activityType | activityTypeContent}}
        </template>
      </el-table-column>
      <el-table-column label="活动状态">
        <template scope='scope'>
          {{scope.row.displayStatus | displayActivityStatusContent}}
        </template>
      </el-table-column>

      <el-table-column
        label="操作">
        <template scope="scope">
          <p>
            <el-button size="small"
              v-for='item in button[scope.row.displayStatus]'
              @click="activitiesAction(item,scope.row.priceStrategyId,scope.row.activityType)"
            >{{buttonContent[item]}}</el-button>
          </p>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
  import {
    savePriceStrategyStart,
    savePriceStrategyStop
  } from 'src/api/index.js'
  export default {
    props: {
      'data': {
        type: Array,
        required: true
      }
    },
    data () {
      return {
        buttonContent: {
          'start': '启动',
          'stop': '停止',
          'edit': '编辑'
        },
        button: {
          1: ['start', 'edit'],
          2: ['edit', 'stop'],
          3: ['edit', 'stop'],
          4: ['start', 'edit'],
          5: []
        }
      }
    },
    methods: {
      activitiesAction (type, id, activityType) {
        this[type](id, activityType)
      },
      edit (id, activityType) {
        let activityTypePath = {
          '1': '/operational/editLJCampaign'
        }
        this.$router.push({
          path: activityTypePath[activityType],
          query: {
            type: 'edit',
            priceStrategyId: id
          }
        })
      },
      start (id) {
        this.$confirm('将启动编号为' + id + '的营销活动', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          savePriceStrategyStart({
            'priceStrategyId': id
          }).then((res) => {
            let result = res.data
            if (result.code === 100) {
              this.$message({
                type: 'success',
                message: '启动成功!'
              })
              this.$emit('updateTable')
            } else if (result.code !== 100) {
              this.$message({
                type: 'error',
                message: '启动失败!'
              })
            }
          })
          .catch(() => {
            this.$message({
              type: 'error',
              message: '启动失败'
            })
          })
        })
        .catch(() => {
          this.$message({
            type: 'error',
            message: '已取消启动'
          })
        })
      },
      stop (id) {
        this.$confirm('将停止编号为' + id + '的营销活动', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          savePriceStrategyStop({
            'priceStrategyId': id
          }).then((res) => {
            let result = res.data
            if (result.code === 100) {
              this.$message({
                type: 'success',
                message: '停止成功!'
              })
              this.$emit('updateTable')
            } else if (result.code !== 100) {
              this.$message({
                type: 'error',
                message: '停止失败!'
              })
            }
          })
          .catch(() => {
            this.$message({
              type: 'error',
              message: '停止失败'
            })
          })
        })
        .catch(() => {
          this.$message({
            type: 'error',
            message: '已取消停止'
          })
        })
      }
    },
    components: {
      // activitiesBtnGroup
    }
  }
</script>

